<template>
	<div id="container">
		<div id="newstaffUpdate_content">
			<el-form>
				<el-form-item size="large">
					<h1>新聘员工报表信息更新</h1>
				</el-form-item>
			</el-form>
			<el-form :label-position="labelPosition" 
						label-width="100px" 
						:model="formLabelAlign" 
						style="max-width: 500px">
				<el-form-item label="部门名称:">
					<el-input placeholder="请输入部门名称..." 
								v-model="newstaffupdate.dep_name"></el-input>
				</el-form-item>
				
				<el-form-item label="岗位名称:">
					<el-input placeholder="请输入岗位名称..." 
								v-model="newstaffupdate.p_name"></el-input>
				</el-form-item>
				
				<el-form-item label="姓名:">
					<el-input placeholder="请输入姓名..." 
								v-model="newstaffupdate.staff_name"></el-input>
				</el-form-item>
				
				<el-form-item label="性别:">
					<el-input placeholder="请输入性别..." 
								v-model="newstaffupdate.staff_sex"></el-input>
				</el-form-item>
				
				<el-form-item label="入职日期:">
					<el-date-picker type="date" 
									value-format="YYYY-MM-DD" 
									v-model="newstaffupdate.entry_date"></el-date-picker>
				</el-form-item>
				
				<el-form-item label="学历:">
					<el-select placeholder="请选择" v-model="newstaffupdate.staff_education">
						<el-option label="小学" value="小学"></el-option>
						<el-option label="初中" value="初中"></el-option>
						<el-option label="高中" value="高中"></el-option>
						<el-option label="专科" value="专科"></el-option>
						<el-option label="本科" value="本科"></el-option>
						<el-option label="硕士研究生" value="硕士研究生"></el-option>
						<el-option label="博士研究生" value="博士研究生"></el-option>
					</el-select>
				</el-form-item>
				
				<el-form-item>
					<div class="btn">
						<el-button type="primary" @click="doBack()">返回</el-button>
						<el-button type="primary" @click="doUpdate()">更新</el-button>
					</div>
						
				</el-form-item>
			</el-form>
		</div>
	</div>
</template>

<script>
	export default {
		name:'NewStaffUpdate',
		data(){
			return{
				newstaffupdate:{
					dep_name:'',
					p_name:'',
					staff_name:'',
					staff_sex:'',
					entry_date:'',
					staff_education:''
				}
			}
		},
		created() {
			let str = sessionStorage.getItem("NewStaff");
			if (str == null || str == '') {
				this.$router.push("/NewStaff");
			} else {
				this.newstaffupdate = JSON.parse(str);
				console.log(this.newstaffupdate);
			}
		},
		methods:{
			doBack(){
				this.$router.push("/NewStaff");
			},
			doUpdate(){
				let str = JSON.stringify(this.newstaffupdate);
				this.$axios.post("http://localhost:8088/eStaff/newStaff/update",this.newstaffupdate)
				.then(rst=>{
					if(rst.data.code==200){
						this.$alert("更新成功","提示");
					}else{
						this.$alert("更新失败","提示");
					}
				}).catch(err=>{
					console.log(err);
				})
			}
		}
	}
	import { reactive, ref } from 'vue'
	const labelPosition = ref('right')
	const formLabelAlign = reactive({
		name: '',
		region: '',
		type: '',
	})
</script>

<style scoped>
	#container {
		width: 100%;
		height: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	
	#newstaffUpdate_content {
		width: 600px;
		height: 550px;
		border-radius: 10px;
		padding: 20px;
		box-sizing: border-box;
		box-shadow: 0px 0px 10px gray;
	}
	
	#newstaffUpdate_content h1 {
		text-align: center;
		width: 100%;
		height: 50px;
	}
	
	#newstaffUpdate_content .btn {
		width: 100%;
		height: 40px;
		text-align: right;
	}
</style>
